<template>
  <!-- No changes to template section -->
</template>

<script>
import api from '../api';

export default {
  data() {
    return {
      serviceList: [],
      pagination: {
        current: 1,
        size: 10,
        total: 0,
        pages: 1
      },
      searchKeyword: '',
      serviceType: '',
      searchTimer: null
    };
  },
  methods: {
    async loadServicePage() {
      try {
        uni.showLoading({
          title: '加载中...'
        });
        
        const { current, size } = this.pagination;
        
        // 构建请求参数
        const params = {
          current, 
          size
        };
        
        // 只有在有值时才添加搜索和筛选参数
        if (this.searchKeyword && this.searchKeyword.trim()) {
          params.keyword = this.searchKeyword.trim();
        }
        
        if (this.serviceType) {
          params.serviceType = this.serviceType;
        }
        
        console.log('Loading service page with params:', params);
        const response = await api.customerService.getServicePage(params);
        
        if (response && response.data) {
          this.serviceList = response.data.list || [];
          this.pagination = {
            current: response.data.current || 1,
            size: response.data.size || 10,
            total: response.data.total || 0,
            pages: response.data.pages || 1
          };
          
          const isFiltering = this.searchKeyword || this.serviceType;
          
          // 如果筛选/搜索后列表为空，显示提示
          if (this.serviceList.length === 0 && isFiltering) {
            uni.showToast({
              title: '没有找到匹配的客服记录',
              icon: 'none',
              duration: 2000
            });
          } 
          // 如果有筛选条件且有结果，显示找到的数量
          else if (isFiltering && this.serviceList.length > 0) {
            uni.showToast({
              title: `找到 ${this.pagination.total} 条匹配记录`,
              icon: 'none',
              duration: 1500
            });
          }
        }
        
        uni.hideLoading();
      } catch (error) {
        uni.hideLoading();
        
        // 更详细的错误信息处理
        let errorMsg = '加载客服列表失败';
        if (error && error.response) {
          if (error.response.status === 404) {
            errorMsg += '：API接口不存在';
          } else if (error.response.data && error.response.data.message) {
            errorMsg += '：' + error.response.data.message;
          }
        } else if (error && error.message) {
          errorMsg += '：' + error.message;
        } else {
          errorMsg += '：请检查网络连接和服务器状态';
        }
        
        uni.showToast({
          title: errorMsg,
          icon: 'none',
          duration: 3000
        });
      }
    },
    // 设置客服类型筛选
    setServiceType(type) {
        console.log('Setting service type:', type);
        // 如果点击了已经选中的类型，则取消筛选
        if (this.serviceType === type && type !== '') {
            this.serviceType = '';
        } else {
            this.serviceType = type;
        }
        
        // 重置到第一页
        this.pagination.current = 1;
        console.log('Loading page with service type:', this.serviceType);
        this.loadServicePage();
    },
    // 防抖搜索
    debounceSearch() {
        console.log('Debounce search triggered');
        if (this.searchTimer) {
            clearTimeout(this.searchTimer);
            this.searchTimer = null;
        }
        this.searchTimer = setTimeout(() => {
            this.searchNow();
        }, 500);
    },
    // 立即搜索
    searchNow() {
        console.log('Search now with keyword:', this.searchKeyword);
        if (this.searchTimer) {
            clearTimeout(this.searchTimer);
            this.searchTimer = null;
        }
        
        // 重置到第一页
        this.pagination.current = 1;
        this.loadServicePage();
    },
    // 清除搜索
    clearSearch() {
        console.log('Clearing search');
        this.searchKeyword = '';
        // 重置到第一页并重新加载数据
        this.pagination.current = 1;
        this.loadServicePage();
    }
  }
};
</script>

<style>
  /* No changes to style section */
</style> 